<include file="layout/header" />
<style>
	.node {display:none}
	.fade-enter-active, .fade-leave-active {
		transition: opacity .5s
	}
	.fade-enter, .fade-leave-active {
		opacity: 0
	}
</style>

<div id="content">

	<section id="widget-grid" class="">
		<!-- START ROW -->

		<div class="row">

			<!-- NEW COL START -->
			<article class="col-sm-12 col-md-12 col-lg-6">

				<!-- Widget ID (each widget will need unique ID)-->
				<div class="jarviswidget" data-widget-colorbutton="false" data-widget-editbutton="false" data-widget-custombutton="false">

					<header>

					</header>

					<!-- widget div-->
					<div>

						<!-- widget edit box -->
						<div class="jarviswidget-editbox">
							<!-- This area used as dropdown edit box -->

						</div>
						<!-- end widget edit box -->

						<!-- widget content -->
						<div class="widget-body no-padding">

							<form class="smart-form">
								<header v-if="menu.id">编辑菜单</header>
								<header v-else>新增后台菜单</header>

								<fieldset>

									<section>
										<label class="label">标题</label>
										<label class="input">
											<input type="text" v-model="menu.title" class="input-sm">
										</label>
										<div class="note">
											用于后台显示的配置标题
										</div>
									</section>

									<section>
										<label class="label">链接</label>
										<label class="input">
											<input type="text" v-model="menu.url">
										</label>
										<div class="note">
											URL函数解析的URL或者外链
										</div>
									</section>

									<section>
										<label class="label">排序</label>
										<label class="input">
											<input type="text" v-model="menu.sort">
										</label>
										<div class="note">
											用于分组显示的顺序
										</div>
									</section>
								</fieldset>

								<fieldset>
									<section>
										<label class="label">上级菜单</label>
										<label class="select">
											<select v-model="menu.pid">
												<option v-for="v in options" v-bind:value="v.id" v-text="v.title"></option>
											</select> <i></i> </label>
											<div class="note">
												所属的上级菜单
											</div>
									</section>
								</fieldset>

								<fieldset>
									<section>
										<label class="label">图标</label>
										<label class="input">
											<input type="text" v-model="menu.icon" class="input-sm">
										</label>
										<div class="note">
											用于显示菜单的图标
										</div>
									</section>
								</fieldset>

								<fieldset>
									<section>
										<label class="label">说明</label>
										<label class="textarea">
											<textarea v-model="menu.tip" rows="3" class="custom-scroll"></textarea>
										</label>
										<div class="note">
											菜单详细说明
										</div>
									</section>
								</fieldset>

								<footer>
									<button type="button" class="btn btn-primary" @click="sub">
										提交
									</button>
									<button type="button" class="btn btn-default" onclick="window.history.back();">
										返回
									</button>
								</footer>
							</form>

						</div>
						<!-- end widget content -->

					</div>
					<!-- end widget div -->

				</div>
				<!-- end widget -->

			</article>
			<!-- END COL -->


			
			<!-- NEW WIDGET START -->
			<article class="col-sm-12 col-md-12 col-lg-6">
	
				<!-- Widget ID (each widget will need unique ID)-->
				<div class="jarviswidget jarviswidget-color-blue" id="wid-id-1" data-widget-editbutton="false">
				
					<header>
						<span class="widget-icon"> <i class="fa fa-sitemap"></i> </span>
						<h2>菜单管理</h2>
	
					</header>
	
					<!-- widget div-->
					<div>
	
						<!-- widget edit box -->
						<div class="jarviswidget-editbox">
							<!-- This area used as dropdown edit box -->
	
						</div>
						<!-- end widget edit box -->
	
						<!-- widget content -->
						<div class="widget-body">
	
							<div class="tree smart-form col-sm-6 col-lg-4">
								<ul>
									<li>
										<span><i class="fa fa-lg fa-folder-open"></i> 菜单列表</span>
										<code>是否禁止</code>
										<ul>
											<li v-for="(v, index) in menus">
												<span @click="edit(index, -1)"><i class="fa fa-lg fa-plus-circle"></i>{{v.title}}</span>&nbsp;&nbsp;
												<label>
													<input type="checkbox" :checked="v.isdis==1?true:false" class="checkbox style-0 is_shows" @change="allInp($event,index)">
													<span></span>
												</label>
												<ul v-bind:class="'child_' + index" class="inpList">
													<li v-for="(item, i) in v.child">
														<span @click="edit(index, i)">
															<i class="icon-leaf"></i>{{item.title}}
														</span>&nbsp;&nbsp;
														<label>
															<input type="checkbox" :checked="item.isdis==1?true:false" class="checkbox style-0 is_shows" @change="ifAllInp($event,item.id,item.pid)">
															<span></span>
														</label>
													</li>
												</ul>
											</li>
										</ul>
									</li>
								</ul>
							</div>
	
						</div>
						<!-- end widget content -->
	
					</div>
					<!-- end widget div -->
	
				</div>
				<!-- end widget -->
	
			</article>
			<!-- WIDGET END -->


		</div>

		<!-- END ROW -->

	</section>

</div>

<include file="layout/footer" />
<script src="__JS__/manage/menu.js"></script>

